<div ng-controller="EntrySampleController">

    <div class="row pad_top" ng-if="entry.canEdit||samples.length>0">
        <div class="col-md-12">
            <button type="button" ng-click="newSample.add=true" class="ice-button" ng-if="entry.canEdit">
                Add Sample
            </button>
        <span ng-if="samples && samples.length">
            &nbsp;
            <span ng-if="!isAddGene(samples)">
            <button ng-if="!entrySampleInCart(entry)" ng-click="openAddToCart(entry.id, samples)" type="button"
                    class="ice-button">
                <i style="font-size: 14px; color: #007dbc" class="fa fa-cart-plus"></i> Add to Cart
            </button>
            <button ng-if="entrySampleInCart(entry)" ng-click="removeFromCart(null, entry)"
                    type="button" class="ice-button">
                <i style="font-size: 14px;" class="fa fa-ban text-danger"></i> Remove From Cart
            </button>
                </span>
            <span ng-if="isAddGene(samples)">
            <button ng-click="requestFromAddGene(samples)" type="button" class="ice-button">
                <i style="font-size: 14px; color: #007dbc" class="fa fa-shopping-cart"></i> Request from Addgene
            </button>
            </span>
        </span>
        </div>
    </div>

    <div class="row pad_top" style="margin-left: 50px" ng-if="newSample.add">
        <div class="col-md-12" ng-init="newSample.location.type=undefined">
            <b class="strong">Storage Type</b>

            <div class="btn-group" uib-dropdown>
                <button type="button" class="btn btn-sm btn-default" uib-dropdown-toggle>
                    Select <span class="caret"></span>
                </button>
                <ul class="uib-dropdown-menu">
                    <li ng-click="newSample.location.type ='PLATE96'"><a>96 Well Plate</a></li>
                    <li ng-click="newSample.location.type ='ADDGENE'"><a>AddGene</a></li>
                    <li ng-click="newSample.location.type ='SHELF'"><a>Shelf</a></li>
                </ul>
            </div>

            <button class="btn btn-sm btn-default" ng-click="newSample.add=undefined">Cancel</button>

            <table class="entry_sample_panel" ng-if="newSample.location.type==='ADDGENE'">
                <tr>
                    <td colspan="4"><strong style="color: #a52a2a;">ADDGENE</strong></td>
                </tr>
                <tr>
                    <td class="pad-8"><img src="img/addgene.jpg" width="100px">
                    </td>
                    <td class="pad-8">
                        <input class="input_box" ng-model="newSample.location.display" placeHolder="Enter Plasmid #"
                               type="text">
                    </td>
                </tr>
                <tr>
                    <td colspan="4" class="small">
                        <div style="height: 1px; margin: 9px 0; overflow: hidden; background-color: #e5e5e5;"></div>
                        <input class="input_box" ng-model="newSample.label" placeHolder="Enter description">
                        <br>
                        <span style="color: #777"><span my-current-time="format"></span></span> - <a
                            ng-href="profile/{{user.id}}">{{user.firstName}} {{user.lastName}}</a>
                    </td>
                </tr>
            </table>

            <table class="entry_sample_panel" ng-if="newSample.location.type==='PLATE96'">
                <tr>
                    <td colspan="{{Plate96Cols.length+1}}">
                        <strong style="color: #a52a2a">PLATE <input class="input_box" placeholder="Enter plate number"
                                                                    ng-model="newSample.location.display"></strong>
                    </td>
                </tr>
                <tr>
                    <td>&nbsp;</td>
                    <td class="text-center" ng-repeat="col in Plate96Cols"><strong>{{col}}</strong></td>
                </tr>
                <tr ng-repeat="row in Plate96Rows">
                    <td><strong>{{row}}</strong>&nbsp;</td>
                    <td ng-repeat="col in Plate96Cols track by $id(col)">
                        <i class="fa opacity_hover" ng-class="{'green':hasTube(row,col),
                       'alert_color':hasWell(row, col)&&!hasTube(row,col), 'fa-circle-thin':!hasContent(row, col),
                       'fa-circle':hasContent(row, col)}"
                           style="font-size: 30px"
                           ng-click="cellBarcodeClick(row, col)"
                           popover-placement="bottom" popover-title="Well {{row + (10+col+'').slice(-2)}}"
                           uib-popover-template="newSampleTemplate"></i>
                    </td>
                </tr>
                <tr>
                    <td colspan="{{Plate96Cols.length+1}}" class="small">
                        <div style="height: 1px; margin: 9px 0; overflow: hidden; background-color: #e5e5e5;"></div>
                        <input class="input_box" ng-model="newSample.label" placeHolder="Enter label">
                        <br>
                        <span style="color: #777" my-current-time="format"></span> - <a
                            ng-href="profile/{{user.id}}">{{user.firstName}} {{user.lastName}}</a>
                    </td>
                </tr>
            </table>

            <table class="entry_sample_panel" ng-if="newSample.location.type==='SHELF'">
                <tr>
                    <td colspan="4">
                        <strong style="color: #a52a2a;">SHELF <input class="input_box" placeholder="Enter shelf label"
                                                                     ng-model="newSample.location.display">
                        </strong>
                    </td>
                </tr>
                <tr>
                    <!--<td>&nbsp;</td>-->
                    <td class="pad-8">
                        <h4 class="text-center" ng-init="newSample.location.child.type='BOX_INDEXED'">Box
                            <input class="input_box" ng-model="newSample.location.child.display">
                        </h4>
                    </td>
                </tr>
                <tr>
                    <td class="pad-8">
                        <h4 class="text-center" ng-init="newSample.location.child.child.type='WELL'">Well
                            <input class="input_box" ng-model="newSample.location.child.child.display">
                        </h4>
                    </td>
                </tr>
                <tr>
                    <td class="pad-8">
                        <h4 class="text-center" ng-init="newSample.location.child.child.child.type='TUBE'">Tube
                            <input class="input_box" ng-model="newSample.location.child.child.child.display">
                        </h4>
                    </td>
                </tr>
                <tr>
                    <td colspan="5" class="small">
                        <div style="height: 1px; margin: 9px 0; overflow: hidden; background-color: #e5e5e5;"></div>
                        <input class="input_box" ng-model="newSample.label" placeHolder="Enter description">
                        <br>
                        <span style="color: #777"><span my-current-time="format"></span></span> - <a
                            ng-href="profile/{{user.id}}">{{user.firstName}} {{user.lastName}}</a>
                    </td>
                </tr>
            </table>

            <div class="pad_top" ng-if="newSample.location.type">
                <button type="submit" class="btn btn-primary btn-sm" ng-click="createNewSample()">Submit</button>
                <button type="button" class="btn btn-default btn-sm" ng-click="newSample.add=false">Cancel</button>
            </div>
        </div>
    </div>

    <div class="row pad_top" ng-if="samples.length===0">
        <div class="col-md-12">
            <i class="text-muted">No samples available</i>
        </div>
    </div>

    <div class="row pad_top" ng-repeat="sample in samples track by $index" ng-if="samples.length > 0">
        <div class="col-md-12">

            <!--widget for plate 96 -->
            <div class="row" ng-if="$index % 2 == 0">

                <!--left sample-->
                <div class="col-md-6" ng-if="samples[$index+0].location.type==='PLATE96'&&samples[$index+0]">
                    <ice-plate96 sample="samples[$index+0]" on-delete="delete(samples[$index+0])"></ice-plate96>
                </div>

                <!--right sample-->
                <div class="col-md-6" ng-if="samples[$index+1].location.type==='PLATE96'&&samples[$index+1]">
                    <ice-plate96 sample="samples[$index+1]" on-delete="delete(samples[$index+1])"></ice-plate96>
                </div>

                <!--widget for shelf-->
                <div class="col-md-6" ng-if="samples[$index+0].location.type==='SHELF'&&samples[$index+0]">
                    <ice-shelf sample="samples[$index+0]" on-delete="delete(samples[$index+0])"></ice-shelf>
                </div>

                <div class="col-md-6" ng-if="samples[$index+1].location.type==='SHELF'&&samples[$index+1]">
                    <ice-shelf sample="samples[$index+1]" on-delete="delete(samples[$index+1])"></ice-shelf>
                </div>

                <!--widget for addgene-->
                <div class="col-md-6" ng-if="samples[$index+0].location.type==='ADDGENE'&&samples[$index+0]">
                    <ice-addgene sample="samples[$index+0]" on-delete="delete(samples[$index+0])"></ice-addgene>
                </div>

                <div class="col-md-6" ng-if="samples[$index+1].location.type==='ADDGENE'&&samples[$index+1]">
                    <ice-addgene sample="samples[$index+1]" on-delete="delete(samples[$index+1])"></ice-addgene>
                </div>

                <!--widget for generic-->
                <div class="col-md-6" ng-if="samples[$index+0].location.type==='GENERIC'&&samples[$index+0]">
                    <ice-generic sample="samples[$index+0]" on-delete="delete(samples[$index+0])"></ice-generic>
                </div>

                <div class="col-md-6" ng-if="samples[$index+1].location.type==='GENERIC'&&samples[$index+1]">
                    <ice-generic sample="samples[$index+1]" on-delete="delete(samples[$index+1])"></ice-generic>
                </div>
            </div>
        </div>
    </div>
</div>